React Native专题
转载注明出处:地址:http://www.lcode.org本文出自:【江清清的技术专栏】本React Native讲解专题:主要讲解了React Native开发，由基础环境搭建配置入门，基础，进阶相关讲解。刚创建的React Native技术交流1群(282693535),React Native技术交流2群(496601483),React Native技术交流3群(496508742)。欢迎各位大牛,React Native技术爱好...
2024-01-10
React Native 已死？
点击上方“CSDN”，选择“置顶公众号”关键时刻，第一时间送达！最近的技术圈尤为热闹，Google 发布了首个 Flutter 预览版、Vue.js 在 GitHub 上的 star 数量超过了 React.js，而如今全球著名的民宿预订平台 Airbnb 突然宣布要弃 React Native 坑而逃，回归原生技术开发，不得不说，这一举措着实让 React Native 备...
2024-01-10
React Native分享记录
今天我给大家分享React Native先给大家看个好东西这个ios app就是用react native写的，没有用到一句OC，也没有用到webview所以今天的主题是使用js写原生应用React Native的主旨是Learn once, write anywhereReact认为各个平台有其各自的特点和特长，如果使用一套代码，一个界面可能不能发挥各自平台的优势，所以...
2024-01-10
React-Native 遇到的坑
一、错误日志：Warning: Failed child context type: Invalid child context virtualizedCell.cellKey of type number supplied to CellRenderer, expected string.这个错误是在使用 RN官网推出最新的列表组件 FlatList 是出现的红色警告，出现这个错误可以正常运行，就是每次调试时看到它总觉得怪怪的，所以就查资料处理了，下面给出解决方...
2024-01-10
React Native 架构一览
一.架构设计整体上分为三大块，Native、JavaScript 与 Bridge：Native 管理 UI 更新及交互，JavaScript 调用 Native 能力实现业务功能，Bridge 在二者之间传递消息。即：最上层提供类 React 支持，运行在JavaScriptCore提供的 JavaScript 运行时环境中，Bridge 层将 JavaScript 与 Native 世界连接起来。具体的，Shadow Tree 用来定...
2024-01-10
React Native 列表的总结
FlatList和SectionList都是React Native中高性能的列表组件。这些新的列表组件在性能方面都有了极大的提升, 其中最主要的一个是无论列表有多少行，它的内存使用都是常数级的。他们有着共同的特点：完全跨平台。行组件显示或隐藏时可配置回调事件。支持单独的头部组件。支持单独的尾部组件。支持...
2024-01-10
react Native 第四天
1.props : 1.props 就是 Image 标签的src ，input 标签的text 用于组件初始化时需要的一些数据。2.使用props可以定制化插件，使插件可以复用3.props是从父元件传入2.理解state 1.有两种类型的数据可以控制组件，一个是props，props在组件的整个生命周期中是固定的2.如果要改变组件的数据需要改变，我们必须使...
2024-01-10
React Native遇到的问题(一)
在我们创建React Native项目的时候发现gradle 版本相对比较低的，而且很多情况下直接编译会报错。而网上的很多解决方案就是gradle version改为1.2.3,于是，我有一个疑问，现在的gradle verion都已经3.0.1了，为什么还不升级呢？但是我发现我直接修改后，更是报各种错。 首先看下图这是我在网上搜到的一与...
2024-01-10
React Native中的全局变量/常量
在ReactNative中，有一种方法可以在全局变量上定义将要使用的所有字符串，就像在Android开发中一样，这里有一个String.xml，您可以在其中放置所有字符串。回答：我要做的是创建一个globals模块…//文件：Globals.jsmodule.exports = { STORE_KEY: 'a56z0fzrNpl^2', BASE_URL: 'http://someurl.com', COLOR: { ORANGE: '#C50', DA...
2024-01-10
React Native获取手机的各种高度
一、窗口高度即图中黄色+蓝色部分import { Dimensions } from "react-native";const deviceHeight = Dimensions.get('window').height; 二、屏幕高度即图中黄色+蓝色+红色部分import { Dimensions } from "react-native";const deviceHeight = Dimensions.get('screen').height; 三、内容高度即图中蓝色部分import { Style...
2024-01-10
React Native声明属性和属性确认
属性声明因为用React Native创建的自定义组件可以复用, 我们开发过程中可能一个项目组有多个人同时开发,其他同事可能会用到我们自定义的组件, 但是他们使用的时候很容易忘记使用某些属性,这时候我们应该在自定义组件中声明一些属性。 //自定义组件export default class ConfirmDialog extends Component { //.......
2024-01-10
关于开发React Native的注意事项
今天在写一个简单的RN的Demo时，一连出现了好几个错误，最后幸亏得以解决，在这里把我踩过的坑以及解决办法分享出来：1.运行出现错误：Could not connect to development server.解决办法：请将项目中 AppDelegate.m 中的 jsCodeLocation = [NSURL URLWithString:@"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];改为jsCode...
2024-01-10
iOS原生项目中集成React Native
1.本文的前提条件是，电脑上已经安装了CocoaPods，React Native相关环境。2.使用Xcode新建一个工程。EmbedRNMeituan[图1]3.使用CocoaPods安装React Native在工程目录下新建Podfile文件，并配置需要使用的第三方库pod 'React', '0.13.0-rc' pod "React/RCTText" pod "React/RCTActionSheet" pod "React/RCTGeolocation" pod "React/RCTIm...
2024-01-10
React Native之FlexBox布局
参考原文链接：https://www.cnblogs.com/wujy/p/5841685.html弹性盒模型（The Flexible Box Module）,又叫Flexbox，意为“弹性布局”，旨在通过弹性的方式来对齐和分布容器中内容的空间，使其能适应不同屏幕，为盒装模型提供最大的灵活性。Flex布局主要思想是：让容器有能力让其子项目能够改变其宽度、高度（甚至...
2024-01-10
React Native开发之expo的使用
背景react native官方现在推荐的项目构建方式是create-react-native-app，即简称CRNA，并且建议使用expo这个APP来实时查看效果。使用CRNA构建项目后，命令行输入npm start，随即会为开发者创建一个开发服务器，并打印出大大的二维码，使用expo扫码，即可预览项目，不过真的这么丝滑吗，使用中还是遇到了一些...
2024-01-10React Native悬浮按钮组件的示例代码
React Native悬浮按钮组件：react-native-action-button，纯JS组件，支持安卓和IOS双平台，支持设置子按钮，支持自定义位置和样式和图标。效果图安装方法npm i react-native-action-button --savereact-native link react-native-vector-icons因为用到了react-native-vector-icons图标组件，需要做下link。如果你项目中已经使用了react-na...
2024-01-10![[RN] <span style='color:red;'>React Native</span> 下拉放大动画](/wp-content/uploads/thumbs/534154_thumbnail.jpg)
[RN] React Native 下拉放大动画
React Native 下拉放大动画经测试，无法运行https://www.jianshu.com/p/1c960ad75020...
2024-01-10无法运行jetifier React Native
我尝试运行react-native run-android，但出现此错误。info Running jetifier to migrate libraries to AndroidX. You can disable it using "--no-jetifier" flag. error Failed to run jetifier. Run CLI with --verbose flag for more details. Error: spawnSync C:\Users\JayK...
2024-01-10
React Native 使用中的调试及探究其机制
前面叙述了相关环境搭建及遇到相关问题个人的解决方法，接下来一起来看看如何进行代码调试：1、使用快捷方式：command + D，调出如下界面并点击“Debug JS Remotely”2、会看到Chrome出现一个页面3、视图 -> 开发者 -> 开发者工具 -> Sources【React Native机制大礼包】使用 JS 构建跨平台的原生应用：React Nati...
2024-01-10
React-native 关于键盘遮挡界面问题
//引入 KeyboardAvoidingView import { KeyboardAvoidingView } from 'react-native';//使用 KeyboardAvoidingView render(){ return <KeyboardAvoidingView behavior={'padding'} style={{flex: 1}}> {/*具体页面内容*/} </KeyboardAvoidingView>}//android 已经处理 其实只需要处理I...
2024-01-10![[RN] <span style='color:red;'>React Native</span> 滚动跳转到指定位置](/wp-content/uploads/thumbs/536523_thumbnail.jpg)
[RN] React Native 滚动跳转到指定位置
React Native 滚动跳转到指定位置一、结构<ScrollView horizontal={true} ref={(view) => { this.myScrollView = view; }}> <View></View> ...<ScrollView>二、实现方法1）先给View增加一个onLayout属性<View onLayout={event=>{this.layoutX = event.nativeEvent.layout.x}}>2）然后通过下面这样就可以实现滚动到指定位置：...
2024-01-10
React-native碰到的坑和解决方案
React-native碰到的坑和解决方案<React/RCTXXXXX.h> file no found1. Clean (cmd+shift+K)2. Build core React - select React as the scheme in Xcode and build it (cmd+B)3. Build the library that is failing (e.g. RCTText).4. Build your app.no such file or directory XXXX文件找...
2024-01-10
React-Native环境搭建（windows）
最近在研究reactNative开发，把环境搭建的过程给大家分享一下，RN环境的搭建真的是异常的困难啊如果需要运行react-native项目，首先必须具备的依赖环境有：1. Java Development Kit 1.8.x(更高版本暂不提供支持)2. Python 2.x(2.7)(3.x不提供支持)3. Node 8.3.x+（低版本不提供支持）4. Yarn5. react-native-cli6. Android Studio ...
2024-01-10
React Suite v3.0 正式版发布
相信很多人会好奇，React Suite 是什么？ React Suite 是 HYPERS 前端团队和 UX 团队开源的一套基于 React 的 UI 组件库，能够帮助您快速构建一个企业级应用。官网访问地址： rsuitejs.com为什么选择 React Suite ?我们在服务于很多企业的过程中发现，不管是大企业，还是中小企业都有一套（或者希望有一套）自...
2024-01-10
携程火车票业务在 React Native 实践中踩过的坑
本文为携程技术中心投稿，版权归原作者所有，非经允许，请勿转载。 【作者简介】姚瑞琼，前端程序媛一枚。2014年毕业后加入携程火车票事业部，今年年初起至今，主要负责 React Native 方案在火车票业务线的实践，先后参与并负责汽车票 RN 独立版、携程 App 抢票 RN 版的开发迭代。 欢迎技术投稿、...
2024-01-10
